<template>
  <a-modal
    title="物流信息"
    :confirm-loading="sendModalLoading"
    :mask-closable="false"
    :destroy-on-close="true"
    :visible="visible"
    @cancel="$emit('update:visible', false)"
  >
    <template slot="footer">
      <a-button key="submit" type="primary" :loading="btnLoading" @click="submitAdd">
        确定
      </a-button>
    </template>

    <a-form-model ref="ruleForm" :rules="formRules" :model="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 10 }">
      <a-form-model-item label="收获人姓名">
        <a-input v-model="form.name" placeholder="" disabled />
      </a-form-model-item>

      <a-form-model-item label="手机号码">
        <a-input v-model="form.mobile" placeholder="" disabled />
      </a-form-model-item>

      <a-form-model-item label="详细地址">
        <a-input v-model="form.detail" placeholder="" disabled />
      </a-form-model-item>

      <a-form-model-item label="邮政编号">
        <a-input v-model="form.zipcode" placeholder="" disabled />
      </a-form-model-item>

      <a-form-model-item label="快递公司" prop="user_send_express">
        <a-select style="width: 150px" placeholder="请选择" v-model="form.user_send_express">
          <a-select-option :value="item" v-for="(item, index) of expressList" :key="index">{{ item }}</a-select-option>
        </a-select>
      </a-form-model-item>

      <a-form-model-item label="快递单号" prop="user_send_express_no">
        <a-input v-model="form.user_send_express_no" placeholder="" />
      </a-form-model-item>
    </a-form-model>
  </a-modal>
</template>

<script>
import { mchOrderRefundSend } from '@/api/purchase/business'

export default {
  components: {},
  props: {
    visible: {
      type: Boolean,
      default: false
    },

    expressList: {
      type: Array,
      default: () => []
    }
  },

  data() {
    return {
      form: {
        order_id: '',
        user_send_express: '',
        user_send_express_no: '',
        mobile: '',
        name: '',
        detail: '',
        zipcode:''
      },

      btnLoading: false,
      formRules: {
        user_send_express: [{ required: true, message: '请选择快递公司', trigger: 'change' }],
        user_send_express_no: [{ required: true, message: '请填写快递单号', trigger: 'blur' }]
      }
    }
  },

  watch: {
    visible(val) {
      if (!val) {
        this.$refs.ruleForm.resetFields()
      }
    }
  },

  methods: {
    submitAdd() {
      this.$refs['ruleForm'].validate(async valid => {
        if (valid) {
          let form = JSON.parse(JSON.stringify(this.form))

          this.btnLoading = true

          delete form.mobile
          delete form.name
          delete form.detail
          delete form.zipcode
          const res = await mchOrderRefundSend(form)

          this.btnLoading = false
          if (res.code == 0) {
            this.$message.success('操作成功')
            this.$emit('update:visible', false)
            this.$emit('getData')
          } else {
            this.$message.error(res.msg)
          }
        } else {
          return false
        }
      })
    }
  }
}
</script>

<style scoped></style>
